<template>
  <NavBar />
  <!-- 科目 -->
  <subject-tree v-show="chapterTreeLength > 0" :treeData="chapterTree" />

  <van-empty v-show="chapterTreeLength ===0" description="暂无数据" />

</template>

<script>
import NavBar from "@/components/layout/nav-bar";
import SubjectTree from "@/components/subject/subject-tree";
import { defineComponent, onBeforeMount, reactive, toRefs } from "vue";
import { showFailToast } from "vant";
import http from "@/utils/http";
export default defineComponent({
  name: "chapter",
  components: { NavBar, SubjectTree },
  setup(){
    const state = reactive({
      chapterTreeLength: 0,
      chapterTree: []
    })

    onBeforeMount(()=>{
      http.get(`/education/subject/tree/${localStorage.subjectPids}`).then(({data: res})=>{
        if (res.code !==0){
          return showFailToast(res.msg)
        }
        state.chapterTree = res.data;
        state.chapterTreeLength = res.data.length;
      })
    })

    return {
      ...toRefs(state)
    }
  }

})
</script>

<style scoped>
.category {
  width: 100%;
  display: flex;
  justify-content: flex-start;
}
</style>
